/**
 * Yutou弹框
 * 调用方法：
 */

import * as React from 'react';
import { View, Text, TextStyle } from 'react-native';

import Button from '../Button';
import styles from './style';
import FastImage from '../FastImage';
import { yutouAlert } from '../../constant/resource';
import { modalClose } from '../../util/global';

interface Alert {
  title?: string;
  desc: string;
  cancelAction?: () => void;
  sureAction?: () => void;
  cancelDesc?: string;
  sureDesc?: string;
}

const YutouAlert = (props: Alert): React.ReactElement => {
  const {
    title = '',
    desc = '',
    cancelAction = modalClose,
    sureAction = (): boolean => true,
    cancelDesc = '取消',
    sureDesc = '确定'
  } = props;

  return (
    <FastImage source={yutouAlert} style={styles.container}>
      <View style={styles.loadDesc}>
        {title ? (
          <Text style={styles.title}>{title}</Text>
        ) : (
          <View style={styles.emptyTitle} />
        )}
        <Text style={styles.desc}>{desc}</Text>
      </View>
      <View style={styles.loadButtons}>
        <Button
          style={styles.sure}
          text={sureDesc}
          textStyle={styles.sureDesc}
          onPress={sureAction}
        />
        <Button
          style={styles.cancel}
          text={cancelDesc}
          textStyle={styles.cancelDesc}
          onPress={cancelAction}
        />
      </View>
    </FastImage>
  );
};

export default YutouAlert;
